// 简化版App组件用于测试

import React from 'react';

function App() {
  console.log('Simple App rendering');
  
  return (
    <div className="min-h-screen bg-gradient-to-br from-purple-50 via-blue-50 to-green-50 p-8">
      <div className="text-center">
        <h1 className="text-4xl font-bold bg-gradient-to-r from-indigo-600 via-purple-600 to-pink-600 bg-clip-text text-transparent mb-4">
          SceneLingo 测试
        </h1>
        <p className="text-gray-600 text-lg">
          如果您看到这个页面，说明基础的React渲染是正常的
        </p>
        <div className="mt-8 p-4 bg-white rounded-lg shadow-lg max-w-md mx-auto">
          <h2 className="text-xl font-semibold mb-4">测试状态</h2>
          <ul className="text-left space-y-2">
            <li>✅ React 渲染正常</li>
            <li>✅ Tailwind CSS 样式正常</li>
            <li>✅ 基础组件结构正常</li>
          </ul>
          <button 
            onClick={() => alert('按钮点击正常！')}
            className="mt-4 px-4 py-2 bg-purple-600 text-white rounded-lg hover:bg-purple-700"
          >
            测试交互
          </button>
        </div>
      </div>
    </div>
  );
}

export default App;
